<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景属性</title>
		<style>
			b ody{
				height: 1000000px;
				width: 100%;
				background-image: url(img/蜡笔小新.png);
				background-size:cover;
				/* 函数 cover 等比例放大照片   特点：原图按照比例放大存背景空
				         【开发者：背景图大小是否等于背景空间】
				       contain 等比例缩放照片 特点：图片 按照比例缩放存背景空间 
					   【开发者：背景图大小等比例显示在背景空间】
					   */
					  /* 背景附件--尺寸中存在cover或者contain */
					  background-attachment:fixed; /*背景图固定*/
			}
			
			div{
				width: 300px;
				height: 300px;
				background-color: #e4393c;
				background: #ffff00;
				background-image: url(img/蜡笔小新.png);
				/* 问题：超大图-不显示  小图-显示
				 注意：背景空间大小、如果图小于背景空间---平铺*/
				 background-repeat: no-repeat; /*不平铺  repeat-x,y横，纵向分布*/
				 /*no-repeat不平铺 repeat-x,y 横，纵向平铺 */
				 background-size: 30%;
				 /* 背景尺寸属性值：数值 px%|函数 cover contain */
				 /* 背景定位：背景空间大于背景图 */
				 background-position:center ;
			}
		</style>
	</head>
	<body>
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Consequatur iusto quidem labore fugiat id. Quia distinctio quod, non cum, esse fuga nulla tempore eius dignissimos ducimus reprehenderit tempora iusto repellat?
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam accusantium sunt voluptatum soluta laboriosam expedita earum doloribus! Quidem minima nostrum illo tempora dolorum, possimus, repudiandae, dignissimos corporis quibusdam fuga beatae!
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo amet officiis laudantium incidunt accusantium doloremque, ratione minima quaerat consequatur eveniet ipsam alias harum doloribus placeat maiores molestias nulla fugit assumenda?
		<!-- html img图片 引入一张作品，位置不可以随意改变
		     css 背景图 引入一张图片，位置可以随意改变
			   子属性 background-color 背景颜色
			         background-image 背景图
					 background-repeat背景重复
					 background-size背景尺寸
					 background-attachment背景附件
					 background-position背景定位
			    复合属性 background:background-image background-color background-poaition
				                   background-size background-repeat和background-attachment
					
				简写属性background:background-image background-poaition|background-size background-repeat
				替代子属性 background-image background-color background-repeat
			   -->
			   <div></div>
	</body>
</html>